<!-- 商家入驻 -->
<template>
	<view class="seller">
		<view class="seller_box">
			<view class="top_upload">
				<view class="top_name">上传图片</view>
				<view class="top_card">
					<dUpload ref="uUpload" :action="action" :file-list="fileList" :show-upload-list="showUploadList" :auto-upload="false" max-count="9">
					</dUpload>
				</view>
			</view>
		</view>
		<view class="middle"></view>
		<bottomSeller></bottomSeller>
		<view @click="submit">
			<sumbitBtn :msg="btn"></sumbitBtn>
		</view>
		<!-- 让父标签 0宽 0高 隐藏溢出 -->
		<view style="width:0px;height:0px; overflow:hidden"> 
			<canvas  id="canvas" ></canvas>
		</view>
	</view>
</template>


<script>
	import bottomSeller from 'pages/user/components/bottom-seller.vue'
	import dUpload from '../components/d-upload.vue'
	import sumbitBtn from 'pages/user/components/sumbit-btn.vue'
	export default {
		components: {
			dUpload,
			sumbitBtn,
			bottomSeller
		},
		data() {
			return {
				btn: "提交",
				upload_img: "/static/img/common_ic_09.png",
				lists: [],
				tempFilePaths: [],
				base64: [],
				showUploadList: true, 
				fileList: []
			};
		},
		computed: {},
		methods: {
			// 调用接口上传
			uploadApi(val) {
				this.$api('init', {
					tempFilePaths: 'data:image/png;base64,' + val
				}).then(res => {
					this.lists = res.data
					console.log(this.lists, 'resdata');
				})
			},
			// 确认提交按钮
			/**
			 * 检测表单信息
			 * 将表单信息提交给后台
			 */
			submit() {
				let files = [];
				// 获取图片列表信息
				this.$refs.uUpload.lists.map((item, i) => {
					// console.log(item, 'item')
					files.push(item)
				})
				// console.log(files, 'files')
				// 图片地址
				for (let i in files) {
					this.tempFilePaths.push(files[i].file.path)
					// console.log(this.tempFilePaths, 'tempFilePaths')
				}
				// console.log(this.tempFilePaths, 'tempFilePaths')
				// 将图片地址转成base64，同时发送请求
				// #ifdef MP-WEIXIN
				console.log(this.tempFilePaths,'wx')
				this.tempFilePaths.map((item, index) => {
					console.log(item,'item')
					this.$tools.getFileSystemManager(item).then(res => {
						this.uploadApi(res.data)
					})
				})
				// #endif
				// #ifdef MP-ALIPAY
				// 支付宝转码
				this.$tools.alypayBase64(this.tempFilePaths).then(res => {
					console.log(res,'res');
					this.uploadApi(res);
				})
				// #endif
			},
		},
		beforeCreate() {},
		created() {},
		beforeMount() {},
		mounted() {},
		beforeUpdate() {},
		updated() {},
		beforeDestroy() {},
		destroyed() {},
		onShow() {
			
		}
	};
</script>

<style lang="scss" scoped>
	@import './index.scss';

	/deep/ .u-add-tips {
		margin-top: 0rpx !important;
	}

	.top_upload {
		.top_card {
			margin: 42rpx 0 42rpx;

			.top_name {
				padding-left: 8rpx;
			}

		}
	}
</style>
